import { lazy } from "react"
import { LazyComponent } from "@/components"

// const Layout = lazy(() /* 入口 */ => import("@/pages/layouts"))
import Layouts from "@/pages/layouts"
const Home = lazy(() /* 首页 */ => import("@/pages/home"))
const Introduction = lazy(() /* 介绍 */ => import("@/pages/docs/introduction"))
const Install = lazy(() /* 安装 */ => import("@/pages/docs/install"))
const PreInstall = lazy(() /* 前置准备 */ => import("@/pages/docs/pre-install"))
const ChangeLog = lazy(() /* 变更日志 */ => import("@/pages/docs/change-log"))
const cssRelation = lazy(() /* 样式相关 */ => import("@/pages/docs/css-relation"))
const Apply = lazy(() /* 应用 */ => import("@/pages/docs/apply"))
const Image = lazy(() /* 图像组件 */ => import("@/pages/components/image"))
const Dialog = lazy(() /* 弹窗组件 */ => import("@/pages/components/dialog"))
const Button = lazy(() /* 按钮组件 */ => import("@/pages/components/button"))
const Ellipsis = lazy(() /* 省略组件 */ => import("@/pages/components/ellipsis"))
const Loading = lazy(() /* loading组件 */ => import("@/pages/components/loading"))
const Table = lazy(() /* table组件 */ => import("@/pages/components/table"))
const Form = lazy(() /* Form组件 */ => import("@/pages/components/form"))
const CheckBox = lazy(() /* 组件 */ => import("@/pages/components/check-box"))
const Input = lazy(() /* 组件 */ => import("@/pages/components/input"))
const Select = lazy(() /* 组件 */ => import("@/pages/components/select"))
const Radio = lazy(() /* 组件 */ => import("@/pages/components/radio"))
const Switch = lazy(() /* 组件 */ => import("@/pages/components/switch"))
const Picker = lazy(() /* 组件 */ => import("@/pages/components/picker"))

export const routes = [
    {
        path: "/",
        element: LazyComponent({ lazyChildren: Layouts }),
        children: [
            {
                path: "",
                element: LazyComponent({ lazyChildren: Home })
            },
            {
                path: "docs",
                children: [
                    {
                        path: "introduction",
                        element: LazyComponent({ lazyChildren: Introduction }),
                        children: []
                    },
                    {
                        path: "install",
                        element: LazyComponent({ lazyChildren: Install }),
                        children: []
                    },
                    {
                        path: "pre-install",
                        element: LazyComponent({ lazyChildren: PreInstall }),
                        children: []
                    },
                    {
                        path: "change-log",
                        element: LazyComponent({ lazyChildren: ChangeLog }),
                        children: []
                    },
                    {
                        path: "css-relation",
                        element: LazyComponent({ lazyChildren: cssRelation }),
                        children: []
                    },
                    {
                        path: "apply",
                        element: LazyComponent({ lazyChildren: Apply }),
                        children: []
                    }
                ]
            },
            {
                path: "components",
                children: [
                    {
                        path: "image",
                        element: LazyComponent({ lazyChildren: Image }),
                        children: []
                    },
                    {
                        path: "dialog",
                        element: LazyComponent({ lazyChildren: Dialog }),
                        children: []
                    },
                    {
                        path: "button",
                        element: LazyComponent({ lazyChildren: Button }),
                        children: []
                    },
                    {
                        path: "ellipsis",
                        element: LazyComponent({ lazyChildren: Ellipsis }),
                        children: []
                    },
                    {
                        path: "loading",
                        element: LazyComponent({ lazyChildren: Loading }),
                        children: []
                    },
                    {
                        path: "table",
                        element: LazyComponent({ lazyChildren: Table }),
                        children: []
                    },
                    {
                        path: "form",
                        element: LazyComponent({ lazyChildren: Form }),
                        children: []
                    },
                    {
                        path: "check-box",
                        element: LazyComponent({ lazyChildren: CheckBox }),
                        children: []
                    },
                    {
                        path: "input",
                        element: LazyComponent({ lazyChildren: Input }),
                        children: []
                    },
                    {
                        path: "select",
                        element: LazyComponent({ lazyChildren: Select }),
                        children: []
                    },
                    {
                        path: "radio",
                        element: LazyComponent({ lazyChildren: Radio }),
                        children: []
                    },
                    {
                        path: "switch",
                        element: LazyComponent({ lazyChildren: Switch }),
                        children: []
                    },
                    {
                        path: "picker",
                        element: LazyComponent({ lazyChildren: Picker }),
                        children: []
                    }
                ]
            }
        ]
    }
]
